/**
 * 表单混入
 * 提供表单组件通用方法
 */
import { getAction, postAction, putAction } from '@/api/manage'

export const FormMixin = {
  props: {
    // 禁用标识
    disabled: {
      type: Boolean,
      default: false,
      required: false
    }
  },
  data() {
    return {
      // 表单对象
      form: this.$form ? this.$form.createForm(this) : null,
      // 标题
      title: '',
      // 宽度
      width: '100%',
      // 表单数据对象
      model: {},
      // 标签布局
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      // 包装布局
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      // 确认加载
      confirmLoading: false,
      // 可见性
      visible: false,
      // 表单校验规则
      rules: {},
      // URL配置
      url: {
        add: '',
        edit: ''
      },
      // 是否显示确定按钮
      showSubmit: true
    }
  },
  methods: {
    /**
     * 表单提交处理
     * @param {Function} callback 回调函数
     */
    handleSubmit(callback) {
      const { form, model } = this
      // 触发表单验证
      form.validateFields((err, values) => {
        if (!err) {
          // 合并表单数据
          let formData = Object.assign(model, values)
          // 提交表单
          this.submitForm(formData, callback)
        }
      })
    },

    /**
     * 提交表单数据
     * @param {Object} formData 表单数据
     * @param {Function} callback 回调函数
     */
    submitForm(formData, callback) {
      this.confirmLoading = true
      // 判断是新增还是编辑
      const url = formData.id ? this.url.edit : this.url.add

      // 使用对应的请求方法
      const httpAction = formData.id ? putAction : postAction

      httpAction(url, formData)
        .then(res => {
          if (res.success) {
            this.$message.success(res.message || (formData.id ? '编辑成功' : '添加成功'))
            this.close()
            // 触发回调
            if (typeof callback === 'function') {
              callback(formData)
            }
            this.$emit('ok', formData)
          } else {
            this.$message.warning(res.message || (formData.id ? '编辑失败' : '添加失败'))
          }
        })
        .catch(err => {
          console.error(err)
        })
        .finally(() => {
          this.confirmLoading = false
        })
    },

    /**
     * 关闭弹窗
     */
    close() {
      this.visible = false
      this.form.resetFields()
      this.model = {}
    },

    /**
     * 显示弹窗
     * @param {Object} record 记录对象
     */
    show(record) {
      this.visible = true
      this.model = Object.assign({}, record)
      this.$nextTick(() => {
        this.form.resetFields()
        if (record) {
          this.form.setFieldsValue(record)
        }
      })
    },

    /**
     * 确认按钮点击事件
     */
    handleOk() {
      this.handleSubmit()
    },

    /**
     * 取消按钮点击事件
     */
    handleCancel() {
      this.close()
    }
  }
}
